<script language="javascript" src="modules/VoteThailandPoll/pnajax/ajax_form_house_no.js"></script>
<script type="text/javascript">
    function validateForm(form) {

      //Check pro_id
      var pro_id = document.getElementById("form_pro_id_");
      if (pro_id.value == '0') {
          alert("กรุณาเลือกจังหวัด");
          pro_id.style.borderStyle = "solid";
          pro_id.style.borderColor = "#FF0000";
          pro_id.style.borderWidth = "1px";
          pro_id.focus();
          return false;
      }else{
          pro_id.style.borderStyle = "solid";
          pro_id.style.borderColor = "#00CC00";
          pro_id.style.borderWidth = "1px";
      }
      
      var dis_id = document.getElementById("form_dis_id_");
      if (dis_id.value == '0') {
          alert("กรุณาเลือกอำเภอ");
          dis_id.style.borderStyle = "solid";
          dis_id.style.borderColor = "#FF0000";
          dis_id.style.borderWidth = "1px";
          dis_id.focus();
          return false;
      }else{
          dis_id.style.borderStyle = "solid";
          dis_id.style.borderColor = "#00CC00";
          dis_id.style.borderWidth = "1px";
      }
      
      var tam_id = document.getElementById("form_tam_id_");
      if (tam_id.value == '0') {
          alert("กรุณาเลือกตำบล");
          tam_id.style.borderStyle = "solid";
          tam_id.style.borderColor = "#FF0000";
          tam_id.style.borderWidth = "1px";
          tam_id.focus();
          return false;
      }else{
          tam_id.style.borderStyle = "solid";
          tam_id.style.borderColor = "#00CC00";
          tam_id.style.borderWidth = "1px";
      }
      
      
      //Check category
      var vil_id = document.getElementById("form_vil_id_");
      if(vil_id){
        if (vil_id.value == '0') {
            alert("กรุณาเลือกหมู่บ้าน");
            vil_id.style.borderStyle = "solid";
            vil_id.style.borderColor = "#FF0000";
            vil_id.style.borderWidth = "1px";
            vil_id.focus();
            return false;
        }else{
            vil_id.style.borderStyle = "solid";
            vil_id.style.borderColor = "#00CC00";
            vil_id.style.borderWidth = "1px";
        }
      }

      //Check party
      var party = document.getElementById("form_par_id_");
      if (party.value == '0') {
          alert("กรุณาเลือกพรรค ");
          party.style.borderStyle = "solid";
          party.style.borderColor = "#FF0000";
          party.style.borderWidth = "1px";
          party.focus();
          return false;
      }else{
          party.style.borderStyle = "solid";
          party.style.borderColor = "#00CC00";
          party.style.borderWidth = "1px";
      }

      //Check house_no
      var house_no = document.getElementById("no");
      if (house_no.value == '') {
          alert("กรุณาบอกบ้านเลขที่ ");
          house_no.style.borderStyle = "solid";
          house_no.style.borderColor = "#FF0000";
          house_no.style.borderWidth = "1px";
          house_no.focus();
          return false;
      }else{
          house_no.style.borderStyle = "solid";
          house_no.style.borderColor = "#00CC00";
          house_no.style.borderWidth = "1px";
      }
      
      //Check latitude
      var latitude = document.getElementById("latitude");
      if (latitude.value == '') {
          alert("Please enter value.");
          latitude.style.borderStyle = "solid";
          latitude.style.borderColor = "#FF0000";
          latitude.style.borderWidth = "1px";
          latitude.focus();
          return false;
      }else{
          document.getElementById('error-latitude').innerHTML = "";
      }

      //Check longitude
      var longitude = document.getElementById("longitude");
      if (longitude.value == '') {
          alert("Please enter value.");
          longitude.style.borderStyle = "solid";
          longitude.style.borderColor = "#FF0000";
          longitude.style.borderWidth = "1px";
          longitude.focus();
          return false;
      }else{
          document.getElementById('error-longitude').innerHTML = "";
      }

    }
</script>

<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
  var geocoder = new google.maps.Geocoder();

  function geocodePosition(pos) {
    geocoder.geocode({
      latLng: pos
    }, function(responses) {
      if (responses && responses.length > 0) {
        updateMarkerAddress(responses[0].formatted_address);
      } else {
        updateMarkerAddress('Cannot determine address at this location.');
      }
    });
  }

  function updateMarkerStatus(str) {
    document.getElementById('markerStatus').innerHTML = str;
  }

  function updateMarkerPosition(latLng) {

    document.getElementById("latitude").value = latLng.lat();
    document.getElementById("longitude").value = latLng.lng();
    document.getElementById('info').innerHTML = [
      latLng.lat(),
      latLng.lng()
    ].join(', ');


  }

  function updateMarkerAddress(str) {
    document.getElementById('address').innerHTML = str;
  }

  function initialize() {
    <!--[if $form.latitude && $form.longitude]-->
     var latLng = new google.maps.LatLng(<!--[$form.latitude]-->, <!--[$form.longitude]-->);
    <!--[else]-->
     var latLng = new google.maps.LatLng(18.23561180974427,100.16967718749993);
    <!--[/if]-->

    var map = new google.maps.Map(document.getElementById('mapCanvas'), {
        scrollwheel: false,
      zoom: 9,
      center: latLng,
      mapTypeId: google.maps.MapTypeId.HYBRID
    });
    var marker = new google.maps.Marker({
      position: latLng,
      title: '<!--[$form.name]-->',
      map: map,
      draggable: true
    });
    
    // Update current position info.
    updateMarkerPosition(latLng);
    geocodePosition(latLng);
    
    // Add dragging event listeners.
    google.maps.event.addListener(marker, 'dragstart', function() {
      updateMarkerAddress('Dragging...');
    });
    
    google.maps.event.addListener(marker, 'drag', function() {
      updateMarkerStatus('Dragging...');
      updateMarkerPosition(marker.getPosition());
    });
    
    google.maps.event.addListener(marker, 'dragend', function() {
      updateMarkerStatus('Drag ended');
      geocodePosition(marker.getPosition());
    });
  }

  // Onload handler to fire off the app.
  google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<TABLE width="100%">
<TR>
  <TD valign="top" width="80%">
      <fieldset>
      <legend>&nbsp;Map information&nbsp;</legend>
      <body>
        <style>
        #mapCanvas {
          width: 100%;
          height: 600px;
          float: left;
        }
        #infoPanel {
          float: left;
          margin-left: 10px;
        }
        #infoPanel div {
          margin-bottom: 5px;
        }
        </style>
        <div id="mapCanvas"></div>
      </fieldset>
  </TD>
  <TD valign="top" width="20%">
      <fieldset>
        <legend>&nbsp;แจ้งผลสำรวจ&nbsp;</legend>
          <form id='form' 
                class='form' 
                action="<!--[pnmodurl modname='VoteThailandPoll' type='userform' func='submit' ctrl='HouseNo']-->" 
                method="post" 
                onsubmit="return validateForm(this)"
          >
              <input type="hidden" name="form[id]" value="<!--[$smarty.request.id]-->" />
              <TABLE width='100%' border="0">
                  <TR>
                    <TD class='td-label' align="left" width="20%">
                      <B>จังหวัด&nbsp;:&nbsp;</B>
                    </TD>
                  </TR>
                  <TR>
                    <TD align="left">
                      <!--[selector_object_array_ex
                            modname="VoteThailandPoll" 
                            class="Province" 
                            field="id" 
                            displayField="name"  
                            name="form[pro_id]" 
                            selectedValue=$form.pro_id 
                            sort="pro_name"
                            onChange="getDistrictByProvinceID()"
                            onClick="getDistrictByProvinceID()"
                            defaultValue="0"
                            defaultText="--------- กรุณาเลือก ---------"
                      ]-->
                      <FONT SIZE="2" COLOR="#FF0000">&nbsp;*</FONT>
                    </TD>
                  </TR>
                  <TR>
                    <TD class='td-label' align="left" width="20%">
                      <B>อำเภอ&nbsp;:&nbsp;</B>
                    </TD>
                  </TR>
                  <TR>
                    <TD align="left">
                      <span id="form_district">
                          <!--[if (isset($smarty.request.form.dis_id) || $smarty.request.form.dis_id == 0) && $smarty.request.form.pro_id]-->
                            <!--[selector_object_array_ex modname="VoteThailandPoll" 
                                    class="District" 
                                    field="id" 
                                    displayField="name"  
                                    name="form[dis_id]" 
                                    sort="dis_name"
                                    selectedValue=$smarty.request.form.dis_id
                                    queryField = dis_pro_id
                                    queryValue = $smarty.request.form.pro_id
                                    onChange="getTambonByDistrictID()"
                            ]-->
                          <!--[elseif $form.dis_id && $form.pro_id]-->
                            <!--[selector_object_array_ex modname="VoteThailandPoll" 
                                    class="District" 
                                    field="id" 
                                    displayField="name"  
                                    name="form[dis_id]" 
                                    sort="dis_name"
                                    selectedValue=$form.pro_id
                                    queryField = dis_pro_id
                                    queryValue = $form.pro_id
                                    onChange="getTambonByDistrictID()"
                            ]-->
                          <!--[else]-->
                          -
                          <!--[/if]-->
                      </span>
                      <div id='error-name'></div>
                    </TD>
                  </TR>
                  <TR>
                    <TD class='td-label' align="left" width="20%">
                      <B>ตำบล&nbsp;:&nbsp;</B>
                    </TD>
                  </TR>
                  <TR>
                    <TD align="left">
                      <span id="form_tambon">
                          <!--[if (isset($smarty.request.form.tam_id) || $smarty.request.form.tam_id == 0) && $smarty.request.form.tam_id]-->
                            <!--[selector_object_array_ex 
                                    modname="VoteThailandPoll" 
                                    class="Tambon" 
                                    field="id" 
                                    displayField="name"  
                                    name="form[tam_id]" 
                                    sort="tam_name"
                                    selectedValue=$smarty.request.form.tam_id
                                    queryField = dis_pro_id
                                    queryValue = $smarty.request.form.tam_id
                            ]-->
                          <!--[elseif $form.dis_id && $form.pro_id && $form.tam_id]-->
                            <!--[selector_object_array_ex 
                                    modname="VoteThailandPoll" 
                                    class="Tambon" 
                                    field="id" 
                                    displayField="name"  
                                    name="form[tam_id]" 
                                    sort="tam_name"
                                    selectedValue=$form.tam_id
                                    queryField = tam_dis_id
                                    queryValue = $form.dis_id
                            ]-->
                          <!--[else]-->
                          -
                          <!--[/if]-->
                      </span>
                    </TD>
                  </TR>
                  <TR>
                    <TD class='td-label' align="left" width="20%">
                      <B>หมู่บ้าน&nbsp;:&nbsp;</B>
                    </TD>
                  </TR>
                  <TR>
                    <TD align="left">
                      <span id="form_village">
                          <!--[if (isset($smarty.request.form.tam_id) || $smarty.request.form.tam_id == 0) && $smarty.request.form.tam_id]-->
                            <!--[selector_object_array_ex 
                                    modname="VoteThailandPoll" 
                                    class="Village" 
                                    field="id" 
                                    displayField="moo"  
                                    name="form[vil_id]" 
                                    sort="vil_moo"
                                    selectedValue=$smarty.request.form.vil_id
                                    queryField = vil_tam_id
                                    queryValue = $smarty.request.form.tam_id
                            ]-->
                          <!--[elseif $form.dis_id]-->
                            <!--[selector_object_array_ex 
                                    modname="VoteThailandPoll" 
                                    class="Village" 
                                    field="id" 
                                    displayField="moo"  
                                    name="form[vil_id]" 
                                    sort="vil_moo"
                                    selectedValue=$form.vil_id
                                    queryField = vil_tam_id
                                    queryValue = $form.tam_id
                            ]-->
                          <!--[else]-->
                          -
                          <!--[/if]-->
                      </span>
                      <div id='error-name'></div>
                    </TD>
                  </TR>
                  <TR>
                    <TD class='td-label' align="left" width="20%">
                      <B>เลือกพรรค&nbsp;:&nbsp;</B>
                    </TD>
                  </TR>
                  <TR>
                    <TD align="left">
                      <!--[selector_object_array_ex
                            modname="VoteThailandPoll" 
                            class="Party" 
                            field="id" 
                            displayField="name"  
                            name="form[par_id]" 
                            selectedValue=$form.par_id 
                            sort="par_name"
                            defaultValue="0"
                            defaultText="--------- กรุณาเลือก ---------"
                      ]-->
                      <FONT SIZE="2" COLOR="#FF0000">&nbsp;*</FONT>
                      <div id='error-name'></div>
                    </TD>
                  </TR>
                  <TR>
                    <TD class='td-label' align="left" width="20%">
                      <B>บ้านเลขที่&nbsp;:&nbsp;</B>
                    </TD>
                  </TR>
                  <TR>
                    <TD align="left">
                      <input type="text" name="form[no]" id="no">
                      <FONT SIZE="2" COLOR="#FF0000">&nbsp;*</FONT>
                      <div id='error-name'></div>
                    </TD>
                  </TR>
                  <TR>
                    <TD class='td-label' align="left" width="20%">
                      <B>หมายเหตุ&nbsp;:&nbsp;</B>
                    </TD>
                  </TR>
                  <TR>
                    <TD align="left">
                      <textarea name="form[comment]" rows="5" cols="22"><!--[$form.comment]--></textarea>
                    </TD>
                  </TR>
                  <TR>
                    <TD class='td-label' align="left" width="20%"><B>latitude&nbsp;:&nbsp;</B></TD>
                  </TR>
                  <TR>
                    <TD align="left">
                      <input id="latitude" 
                            type="text" 
                            name="form[latitude]" 
                            value="<!--[$form.latitude]-->" 
                            title="latitude" 
                            class="required" 
                            size="25"  
                      />
                      <FONT SIZE="2" COLOR="#FF0000">&nbsp;*</FONT>
                      <span id='error-latitude'></span>
                    </TD>
                  </TR>
                  <TR>
                      <TD class='td-label' align="left" width="20%"><B>longitude&nbsp;:&nbsp;</B></TD>
                  </TR>
                  <TR>
                    <TD align="left">
                      <input id="longitude" 
                            type="text" 
                            name="form[longitude]" 
                            value="<!--[$form.longitude]-->" 
                            title="longitude" 
                            class="required" 
                            size="25" 
                      />
                      <FONT SIZE="2" COLOR="#FF0000">&nbsp;*</FONT>
                      <span id='error-longitude'></span>
                    </TD>
                  </TR>
                  <TR>
                    <TD align="left" width="100%">
                      <INPUT TYPE="submit" value="submit">
                      <input type="button" 
                              name="Cancel" 
                              value="Cancel" 
                              onclick="window.location = '<!--[pnmodurl modname='VoteThailandPoll' type='admin' func='list' ctrl='Province']-->' " 
                      />
                    </TD>
                  </TR>
              </TABLE>
          </form><BR>
        <hr>
        <div id="infoPanel">
          <b>Marker status:</b>
          <div id="markerStatus"><i>Click and drag the marker.</i></div>
          <b>Current position:</b>
          <div id="info"></div>
          <b>Closest matching address:</b>
          <div id="address"></div>
        </div>
      </body>
      </html>
      </fieldset><BR>
  </TD>
</TR>
</TABLE>

